<template>
  <div>
    <el-menu-item v-if=" item.show &&( item.children == null || item.children.length == 0 )"
                  :index="resolvepath(item.path)"  >
      <i class="el-icon-menu"></i>{{ item.name }}
    </el-menu-item>
<!--    <el-menu-item v-else-if="item.children.length == 1"-->
<!--                  :index="constructPath(resolvepath(item.path), item.children[0].path)">-->
<!--      <i class="el-icon-menu"></i>{{ item.children[0].name }}-->
<!--    </el-menu-item>-->
    <el-submenu v-else-if="item.show " :index="resolvepath(item.path)" >
      <template slot="title"><i class="el-icon-menu"></i>{{ item.name }}</template>
      <menubar v-for="child in item.children" :parentpath="resolvepath(item.path)" :item="child"></menubar>
    </el-submenu>
  </div>
</template>

<script>
export default {
  name: 'menubar',
  props: [
    'parentpath', 'item'
  ],
  // computed: {
  //   routes() {
  //     return this.$router.options.routes
  //   }
  //
  // },
  methods: {
    resolvepath(path) {
      if (path[0] == '/') {
        path = path.substring(1)
        // console.log('/ 被去掉了' + path)
      }

      if (this.parentpath == '' || this.parentpath == '/') {
        return '/' + path
      } else
        return this.parentpath + '/' + path
    },
    constructPath(parentPath, path){
      if (path[0] == '/') {
        path = path.substring(1)
      }
      if (parentPath == '' || parentPath == '/') {
        // console.log('/' + path)
        return '/' + path
      } else
        console.log(parentPath + '/' + path)
        return parentPath + '/' + path
    },
    click() {
      console.log(this.routes)
    },
    handleSelect() {
      // console.log(this.$router)
    }
  }
}
</script>

<style scoped>

</style>
